@import "compass/css3";
.bar{
	.info{
		//unlogin
		.unlogin{
			margin-right: 10px;
		}
		//logined
		.head-icon{
			padding-top:15px;
			margin-right:10px;
			img{
				@include border-radius(15px);
			}
		}
		.user-center{
			margin-right: 10px;
			padding-bottom:5px;
			position:relative;
			.list{
				// display:none;
				position:absolute;
				top:40px;
				left:-30px;
				width:100px;
				padding:10px 0;
				text-align: center;
				list-style: none;
				line-height: 30px;
				background:#fff;
				color:#d7d7d7;
				@include border-radius(4px);
			}
			&:hover{
				.list{
					display: block;
				}
			}
		}
	}
}
#index{
	font-family:"Microsoft YaHei";
	color:#333;
	font-size:15px;
	.content{
		width:1000px;
		margin:80px auto 0;
		.show{
			.plan{
				float:left;
				width:220px;
				height:198px;
				background:#6BC66E;
				padding:30px;
				text-align: center;
				.join{
					font-weight:700;
					color:#fff;
					text-align: center;
					border-bottom:dashed 1px #999;
					font-size: 27px;
					// line-height: 30px;
					padding-bottom:10px;
				}
				.help{
					color:#fff;
					font-weight: 500;
					text-align: center;
					border-bottom:dashed 1px #999;
					font-size: 22px;
					padding:10px 0;
				}
				.result1{
					color:#fff;
					text-align: center;
					margin-top:20px;
				}
				.result2{
					color:#fff;
					text-align: center;
					margin: 20px 0;
				}
				.apply-btn{
					display: block;
					width: 193px;
					height: 45px;
					// background: url(../img/cupper.png) no-repeat 0 0;
					outline: 0;
					margin: auto;
					&:hover{
						// background: url(../img/cupper.png) no-repeat 0 0;
						// background-position:0 -48px;
					}
				}
				
			}
			.slide-content{
				float:left;
				width:720px;
				height:258px;
				overflow: hidden;
				position:relative;

				.slide-content-copy{
					position:absolute;
					top:0;
					left:0;
					width:100%;
					height:100%;
					.left-prev{
						float:left;
						width:50%;
						height:100%;
						&:hover{
							.prev{
								background:transparent;
								display: block;
								cursor:pointer;
								&:hover{
									background:#999;
								}
							}
						}
						.prev{
							display: none;
							position:absolute;
							top:50%;
							left:5px;
							z-index:5;
							margin-top:-31.5px;
							padding:10px;
							@include border-radius(5px);
						}
					}
					.right-next{
						float:left;
						width:50%;
						height:100%;
						&:hover{
							.next{
								background:transparent;
								display: block;
								cursor:pointer;
								&:hover{
									background:#999;
								}
							}
						}
						.next{
							display: none;
							position:absolute;
							top:50%;
							right:5px;
							z-index:5;
							margin-top:-31.5px;
							padding:10px;
							@include border-radius(5px);			
						}
					}
				}
				
				.img{
					float:left;
				}
			}
		}
	}
	.free{
		padding: 22px 0 5px;
		margin-top:22px;
		color:#444;
		text-align: center;
		font-size: 24px;
		background-color: #f6f5ee;
		h3{
			min-width: 1000px;
		}
		.bookslist{
			width:1000px;
			margin:20px auto;
			li{
				float:left;
				width:16.666666%;
				margin-bottom: 20px;
				text-align:center;
				position:relative;
				&:hover{
					cursor:pointer;
					.float-name{
						display: block;
						height:209px;
						width:100%;
						background:#DBE6E5;
						opacity:0.7;
						-webkit-transition:opacity 2s;
						&:hover{
							.float-book-name{
								-webkit-transform:translate(0,0);
								-webkit-transition:-webkit-transform 1s ease-in-out;
							}
							.gogo{
								-webkit-transform:translate(0,0);
								-webkit-transition:-webkit-transform 1s ease;
							}
						}
						.float-book-name{
							display: block;
							font-weight:700;
							font-size: 16px;
							-webkit-transform:translate(0px,100px);
						}
						.gogo{
							display: block;
							-webkit-transform:translate(0px,100px);
							@include box-shadow(0 0px 0 #67BB6A);
							&:hover{
								color:#67BB6A;
								@include box-shadow(0 2px 0 #999);
							}
						}
					}
					img{
						opacity: 0.1;
						-webkit-transition:opacity 2s;
					}
					.book-name{
						color:#f6f5ee;
						-webkit-transition:color 1s;
						background-color: #f6f5ee;
					}
					.free-info{
						opacity: 1;
						background-color: #f6f5ee;
					}
				}
				.float-name{
					width:0;
					height:0px;
					background:#DBE6E5;
					opacity:0;
					position:absolute;
					top:0;
					left:0;
					z-index:5;
					@include border-radius(10px);
					.float-book-name{
						display: none;
						padding:0 25px;
						height:60px;
						line-height: 20px;
						color:#000;
						font-size: 14px;
						margin:30px auto;
					}
					.gogo{
						display: none;
						color:#000;
						font-size: 14px;
						text-decoration: none;
						border:#67BB6A solid 1px;
						background:#fff;
						height:30px;
						line-height: 30px;
						width:80px;
						margin:auto;
						@include border-radius(5px);
					}
				}
				img{
					width:129px;
					height:167px;
					padding:10px 0;
					opaticy:1;
				}
				.book-name{
					font-size: 13px;
					margin:0 auto;
					color: #555;
					width:70%;
					height: 42px;
					line-height: 21px;
					overflow: hidden;
				}
				.free-info{
					color: #c97618;
					font-size: 14px;
					height: 23px;
					line-height: 23px;
					.time-free{
						color: #c97618;
					}
					.book-prize{
						font-size: 12px;
						color: #999;
						text-decoration: line-through;
					}
				}
			}
		}
	}
}